<template>
  <div>
    <p>我是HelloWorld组件内容</p>
    <p>{{message}}</p>
    <p>{{list}}</p>
  </div>
  
</template>

<script setup>
import { ref } from 'vue'

// P31:父组件Content向子组件Helloworld传递数据,父组件直接在组件上写传递的值,子组件通过props接受
// defineProps(['msg'])    // 1.用字符数组
defineProps({
  // 2. 用对象的形式,还能声明类型
  message:{
      type: String,
      default: "你好2",
      required: true,
  },
  list:{
        type: Array,
        default(){
          return [];
        }
      }
})  
</script>



<style scoped>
</style>

<!-- Vue2 写法 -->
<!-- <script>
  export default {
  // props:['message'] // 1.字符串数组
    props:{
      // 1.类型限制
      // message: String
      // 2.设置默认值
      message:{
        type: String,
        default: "你好",
      },
      // 对象或数组的默认值
      // 必须从一个工厂函数返回。
      list:{
        type: Array,
        default(){
          return [];
        }
      }
    }
  }
</script> -->
